<template>
  <!-- 数据清洗/数据清洗转换/资源注册 -->
  <div
    class="zyzc"
    v-loading="loading"
    element-loading-text="拼命下载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
  >
    <div v-if="flag">
      <el-row :span="24">
        <el-col :span="4">
          <div class="z_left">
            <el-input
              style="color: #fff"
              placeholder="查询"
              suffix-icon="el-icon-search"
            ></el-input>
            <div class="l_bottom">
              <!-- 我的目录 -->
              <el-tree
                default-expand-all
                highlight-current="true"
                :data="data"
                :props="defaultProps"
                @node-click="handleNodeClick"
              ></el-tree>
            </div>
          </div>
        </el-col>
        <el-col :span="20">
          <div class="z_right">
            <div class="input">
              <el-input
                placeholder="请输入内容"
                v-model="inputVal"
                class="input-with-select"
              >
                <el-select v-model="select" slot="prepend" placeholder="请选择">
                  <el-option label="数据类型" value="1"></el-option>
                  <el-option label="关键字" value="2"></el-option>
                  <el-option label="编码" value="3"></el-option>
                </el-select>
                <el-button
                  style="background: #409eff; color: #fff"
                  type="primary"
                  slot="append"
                  >查询</el-button
                >
              </el-input>
            </div>
            <div class="btn">
              <el-dropdown trigger="click" @command="handleCommand">
                <el-button
                  icon="el-icon-plus"
                  style="color: #fff !important; padding: 10px 30px"
                  type="primary"
                  size="middle"
                >
                  新增
                </el-button>
                <el-dropdown-menu style="padding: 10px 15px" slot="dropdown">
                  <el-dropdown-item
                    command="a"
                    style="
                      border: 1px solid #eee;
                      background: #efefef;
                      margin-bottom: 5px;
                    "
                  >
                    <div class="itemBox">
                      <i class="el-icon-s-cooperation"></i>
                      <p>数据库资源</p>
                    </div>
                  </el-dropdown-item>
                  <el-dropdown-item
                    command="b"
                    style="
                      border: 1px solid #eee;
                      background: #efefef;
                      margin-bottom: 5px;
                    "
                  >
                    <div class="itemBox">
                      <i class="el-icon-s-ticket"></i>
                      <p>FTP资源</p>
                    </div></el-dropdown-item
                  >
                  <el-dropdown-item
                    command="c"
                    style="
                      border: 1px solid #eee;
                      background: #efefef;
                      margin-bottom: 5px;
                    "
                  >
                    <div class="itemBox">
                      <i class="el-icon-chicken"></i>
                      <p>代理资源</p>
                    </div></el-dropdown-item
                  >
                  <el-dropdown-item
                    command="d"
                    style="
                      border: 1px solid #eee;
                      background: #efefef;
                      margin-bottom: 5px;
                    "
                  >
                    <div class="itemBox">
                      <i class="el-icon-s-grid"></i>
                      <p>服务器资源</p>
                    </div></el-dropdown-item
                  >
                  <el-dropdown-item
                    command="e"
                    style="border: 1px solid #eee; background: #efefef"
                  >
                    <div class="itemBox">
                      <i class="el-icon-s-cooperation"></i>
                      <p>kafka资源</p>
                    </div>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </div>
            <!-- 表格部分 -->
            <div class="table">
              <el-table
                :header-cell-style="changeBgcolor"
                :data="tableData"
                style="width: 100%"
              >
                <el-table-column prop="bmNum" label="编码" width="100">
                </el-table-column>
                <el-table-column prop="name" label="名称" width="100">
                </el-table-column>
                <el-table-column prop="type" label="类型（数据库资源）">
                </el-table-column>
                <el-table-column prop="datatype" label="数据库类型（全部）">
                </el-table-column>
                <el-table-column prop="createTime" label="创建时间">
                </el-table-column>
                <el-table-column prop="changeTime" label="修改时间">
                </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <!-- 编辑 -->
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="编辑"
                      placement="bottom"
                    >
                      <span
                        style="
                          display: inline-block;
                          margin-right: 20px;
                          color: #409eff;
                        "
                        @click="handleEdit(scope.$index, scope.row, 0)"
                      >
                        <i class="el-icon-edit"></i
                      ></span>
                    </el-tooltip>

                    <!-- 查看 -->
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="查看"
                      placement="bottom"
                    >
                      <span
                        style="
                          display: inline-block;
                          margin-right: 20px;
                          color: #409eff;
                        "
                        @click="handleEdit(scope.$index, scope.row, 1)"
                      >
                        <i class="el-icon-view"></i
                      ></span>
                    </el-tooltip>
                    <!-- 资源扫描 -->
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="资源扫描"
                      placement="bottom"
                    >
                      <span
                        style="
                          display: inline-block;
                          margin-right: 20px;
                          color: #409eff;
                        "
                        @click="handleEdit(scope.$index, scope.row, 2)"
                      >
                        <i class="el-icon-platform-eleme"></i
                      ></span>
                    </el-tooltip>
                    <!-- 删除 -->
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="删除"
                      placement="bottom"
                    >
                      <span
                        style="color: #409eff"
                        @click="handleEdit(scope.$index, scope.row, 3)"
                      >
                        <i class="el-icon-delete"></i
                      ></span>
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </el-col>
      </el-row>
    </div>
    <div class="addPage" v-else>
      <p class="info" @click="flag = true">
        <span><i class="el-icon-back"></i></span>
      </p>
      <el-tabs
        :tab-position="tabPosition"
        v-model="activeName"
        style="height: 700px"
        v-if="isSm"
      >
        <el-tab-pane label="配置" name="pz">
          <div class="peizhi">
            <p class="title">基本信息</p>
            <div class="con">
              <el-form
                style="width: 100%"
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
              >
                <el-form-item style="width: 30%" label="启动定时">
                  <el-select v-model="formInline.region" placeholder="启动定时">
                    <el-option label="是" value="shanghai"></el-option>
                    <el-option label="否" value="beijing"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="启动时间">
                  <el-col :span="5">
                    <el-date-picker
                      type="date"
                      placeholder="选择日期"
                      v-model="formInline.date1"
                      style="width: 100%"
                    ></el-date-picker>
                  </el-col>
                  <el-col class="line" :span="1">-</el-col>
                  <el-col :span="5">
                    <el-time-picker
                      placeholder="选择时间"
                      v-model="formInline.date2"
                      style="width: 100%"
                    ></el-time-picker>
                  </el-col>
                </el-form-item>
              </el-form>
              <el-form
                style="width: 100%"
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
              >
                <el-form-item style="width: 30%" label="扫描周期">
                  <el-input
                    style="width: 85%"
                    placeholder="请输入内容"
                    v-model="formInline.time"
                  >
                    <template slot="append">分</template>
                  </el-input>
                </el-form-item>
                <el-form-item label="扫描用户">
                  <el-select v-model="formInline.user" placeholder="扫描用户">
                    <el-option label="GLQ1" value="GLQ1"></el-option>
                    <el-option label="MYSQL" value="MYSQL"></el-option>
                  </el-select>
                </el-form-item>
              </el-form>
              <el-form
                style="width: 100%"
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
              >
                <el-form-item style="width: 30%" label="扫描全部">
                  <el-select v-model="formInline.isAll" placeholder="请选择">
                    <el-option label="是" value="1"></el-option>
                    <el-option label="否" value="0"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="是否增量">
                  <el-select v-model="formInline.isAdd" placeholder="请选择">
                    <el-option label="是" value="1"></el-option>
                    <el-option label="否" value="0"></el-option>
                  </el-select>
                </el-form-item>
              </el-form>
            </div>
            <p class="title">明细信息</p>
            <el-button type="primary" style="float: right" icon="el-icon-plus"
              >新建</el-button
            >
            <div style="width: 100%; margin-top: 100px">
              <el-table
                :data="dataList"
                border
                style="width: 100%; margin-top: 20px"
              >
                <el-table-column prop="user" label="扫描用户"></el-table-column>
                <el-table-column prop="type" label="实体类型"></el-table-column>
                <el-table-column
                  prop="mainFont"
                  label="关键字"
                ></el-table-column>
                <el-table-column prop="ml" label="存放目录"></el-table-column>
                <el-table-column
                  prop="status"
                  label="有效状态"
                ></el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <!-- 删除 -->
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="删除"
                      placement="bottom"
                    >
                      <span
                        style="color: #409eff"
                        @click="Fndelete(scope.$index, scope.row)"
                      >
                        <i class="el-icon-delete"></i
                      ></span>
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div style="float: right; margin-top: 50px">
              <el-button @click="saomiao" type="primary">扫描</el-button>
              <el-button @click="baocun" type="primary">保存</el-button>
              <el-button @click="quxiao" type="info">取消</el-button>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="日志" name="log">
          <div style="width: 100%; margin-top: 10px; padding: 10px">
            <el-table
              :data="dataList"
              border
              style="width: 100%; margin-top: 20px"
            >
              <el-table-column prop="user" label="执行用户"></el-table-column>
              <el-table-column prop="type" label="启动时间"></el-table-column>
              <el-table-column
                prop="mainFont"
                label="结束时间"
              ></el-table-column>
              <el-table-column prop="ml" label="耗时（秒）"></el-table-column>
              <el-table-column prop="status" label="扫描状态"></el-table-column>
              <el-table-column prop="status" label="启动方式"></el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <!-- 查看 -->
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="查看明细"
                    placement="bottom"
                  >
                    <span
                      style="color: #409eff"
                      @click="look(scope.$index, scope.row)"
                    >
                      <i class="el-icon-view"></i
                    ></span>
                  </el-tooltip>
                  <!-- 弹窗  日志详情页 -->
                  <el-dialog
                    title="明细日志"
                    :visible.sync="dialogVisible"
                    width="50%"
                    :before-close="handleClose"
                  >
                    <el-table :data="logList" style="width: 100%">
                      <el-table-column prop="bm" label="编目">
                      </el-table-column>
                      <el-table-column prop="name" label="名称">
                      </el-table-column>
                      <el-table-column prop="type" label="类型">
                      </el-table-column>
                      <el-table-column prop="objStatus" label="对象状态">
                      </el-table-column>
                    </el-table>
                  </el-dialog>
                  <!-- 下载 -->
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="下载日志"
                    placement="bottom"
                  >
                    <span
                      style="color: #409eff"
                      @click="download(scope.$index, scope.row)"
                    >
                      <i class="el-icon-download"></i
                    ></span>
                  </el-tooltip>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-tab-pane>
      </el-tabs>
      <div v-else>
        <div class="nTitle"><span>|</span>{{ newTitle }}</div>
        <div class="whriteFrom">
          <!-- 基本信息输入 -->
          <p>基本信息：</p>
          <div class="baseInfo" style="font-size: 16px">
            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="100px"
              class="demo-ruleForm"
            >
              <el-form-item label="编码：" prop="bmNum" style="width: 38%">
                <el-input
                  :disabled="isChose"
                  style="width: 100%"
                  v-model="formInfo.bmNum"
                ></el-input>
              </el-form-item>
              <el-form-item label="名称：" prop="name">
                <el-input
                  :disabled="isChose"
                  v-model="formInfo.name"
                  style="width: 100%"
                ></el-input>
              </el-form-item>
            </el-form>
            <el-form
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="100px"
              class="demo-ruleForm"
            >
              <el-form-item label="目录：" prop="value">
                <el-cascader
                  :disabled="isChose"
                  style="width: 74%"
                  v-model="formInfo.value"
                  :options="data"
                  @change="handleChange"
                ></el-cascader>
              </el-form-item>
              <el-form-item label="备注：" prop="bzText">
                <el-input
                  :disabled="isChose"
                  v-model="formInfo.bzText"
                  type="textarea"
                  :rows="4"
                  style="width: 74%"
                >
                </el-input>
              </el-form-item>
            </el-form>
          </div>
          <!-- 连接信息 -->
          <p>连接信息：</p>
          <div class="concatInfo" style="font-size: 16px">
            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
            >
              <el-form-item
                label="数据库类型："
                prop="value1"
                style="margin-right: 100px"
              >
                <el-cascader
                  :disabled="isChose"
                  style="width: 120%; margin-right: 100px"
                  v-model="formInfo.value1"
                  :options="option1"
                  @change="handleChange1"
                ></el-cascader>
              </el-form-item>
              <el-form-item label="是否集群：" prop="isJq">
                <el-switch :disabled="isChose" v-model="formInfo.isJq">
                </el-switch>
              </el-form-item>
            </el-form>
            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
            >
              <el-form-item
                label="字符集："
                prop="value2"
                style="margin-right: 100px"
              >
                <el-cascader
                  :disabled="isChose"
                  style="width: 120%; margin-right: 100px"
                  v-model="formInfo.value2"
                  :options="option2"
                  @change="handleChange2"
                ></el-cascader>
              </el-form-item>
              <el-form-item label="最大连接数：" prop="maxConcatNum">
                <el-input
                  :disabled="isChose"
                  v-model="formInfo.maxConcatNum"
                  style="width: 160%"
                ></el-input>
              </el-form-item>
            </el-form>

            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
            >
              <el-form-item
                label=" 连接地址："
                prop="concatAddress"
                style="margin-right: 110px"
              >
                <el-input
                  :disabled="isChose"
                  v-model="formInfo.concatAddress"
                  style="width: 125%; margin-right: 100px"
                ></el-input>
              </el-form-item>
              <el-form-item label=" 服务名：" prop="serveName"
                ><el-input
                  :disabled="isChose"
                  v-model="formInfo.serveName"
                  style="width: 165%"
                ></el-input
              ></el-form-item>
            </el-form>
            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
              v-if="formInfo.value1 == 'Hbase'"
            >
              <el-form-item
                label=" 用户名："
                prop="username"
                style="margin-right: 100px"
              >
                <el-input
                  :disabled="isChose"
                  v-model="formInfo.username"
                  style="width: 130%; margin-right: 100px"
                ></el-input>
              </el-form-item>
              <el-form-item label=" 密码：" prop="pasword"
                ><el-input
                  :disabled="isChose"
                  v-model="formInfo.pasword"
                  style="width: 170%"
                ></el-input
              ></el-form-item>
            </el-form>
            <el-form
              :inline="true"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
              v-else
            >
              <el-form-item
                label="安全认证类型："
                prop="value3"
                style="margin-right: 100px"
              >
                <el-cascader
                  :disabled="isChose"
                  style="width: 120%; margin-right: 100px"
                  v-model="formInfo.value3"
                  :options="option3"
                  @change="handleChange3"
                ></el-cascader>
              </el-form-item>
              <el-form-item label="安全认证文件：" prop="file">
                <el-upload :disabled="isChose" style="float: left">
                  <el-button :disabled="isChose" size="small" type="primary"
                    >请上传文件</el-button
                  >
                </el-upload>
              </el-form-item>
            </el-form>
            <el-form
              v-if="formInfo.value1 == 'Hbase'"
              :model="formInfo"
              :rules="rules"
              ref="ruleForm"
              label-width="150px"
              class="demo-ruleForm"
            >
              <el-form-item label="集群连接信息：" prop="jqLjInfo"
                ><el-input
                  :disabled="isChose"
                  v-model="formInfo.jqLjInfo"
                  type="textarea"
                  :rows="5"
                  style="width: 75%"
                ></el-input
              ></el-form-item>
            </el-form>
          </div>
        </div>
        <!-- 按钮 -->
        <div class="btnInfo">
          <el-button type="primary" @click="cslj">测试链接</el-button>
          <el-button type="primary" @click="submit">提交</el-button>
          <el-button type="info" @click="cancel">取消</el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isChose: false,
      dialogVisible: false,
      isSm: false,
      loading: false,
      activeName: "pz",
      tabPosition: "left",
      formInline: {
        date1: "",
        date2: "",
        region: "",
        user: "",
        time: "",
        isAll: "",
        isAdd: "",
      },
      formInfo: {
        bmNum: "", //编码
        name: "", //名称
        value: "", //目录
        bzText: "", //备注
        value1: "", //数据库类型
        isJq: false, //是否集群
        value2: "", //字符集
        maxConcatNum: "", //最大连接数
        concatAddress: "", //连接地址
        serveName: "", //服务名
        username: "", //用户名
        pasword: "", //密码
        value3: "", //安全认证类型
        jqLjInfo: "", //集群连接信息
        file: "",
      },
      rules: {
        bmNum: [{ required: true, message: "请输入编码", trigger: "blur" }],
        name: [{ required: true, message: "请输入名称", trigger: "blur" }],
        maxConcatNum: [
          { required: true, message: "请输入最大连接数", trigger: "blur" },
        ],
        concatAddress: [
          { required: true, message: "请输入连接地址", trigger: "blur" },
        ],
        username: [
          { required: true, message: "请输入用户名", trigger: "blur" },
        ],
        pasword: [{ required: true, message: "请输入密码", trigger: "blur" }],
        serveName: [
          { required: true, message: "请输入服务器名", trigger: "blur" },
        ],
        jqLjInfo: [
          { required: true, message: "请输入集群连接信息", trigger: "blur" },
        ],
        isJq: [
          { required: true, message: "请选择是否集群", trigger: "change" },
        ],
        value1: [
          { required: true, message: "请选择数据库类型", trigger: "change" },
        ],
        value3: [
          { required: true, message: "请选择安全认证类型", trigger: "change" },
        ],
        file: [
          { required: true, message: "请上传安全认证文件", trigger: "change" },
        ],
        value: [
          {
            required: true,
            message: "请选择目录",
            trigger: "change",
          },
        ],
      },
      flag: true,
      newTitle: "",

      data: [
        {
          id: 1,
          label: "我的目录(2)",
          value: 1,
          children: [
            {
              id: 2,
              label: " YK_BMV_META(0)",
              value: 2,
              // children: [
              //   {
              //     label: "",
              //   },
              // ],
            },
            {
              id: 3,
              label: " 元数据测试(0)",
              value: 3,
            },
            {
              id: 4,
              label: " 数据建模测试目录(0)",
              value: 4,
            },
            {
              id: 5,
              label: "defaultDirectory(0)",
              value: 5,
            },
            {
              id: 6,
              label: " weining_test(0)",
              value: 6,
            },
            {
              id: 7,
              label: "Dong_test(2)",
              value: 7,
              children: [
                {
                  id: 8,
                  label: "Kafaka资源（1）",
                  value: 8,
                },
                {
                  id: 9,
                  label: "数据库（1）",
                  value: 9,
                },
              ],
            },
          ],
        },
      ],
      option1: [
        {
          label: "Hbase",
          value: "Hbase",
        },
        {
          label: "HDFS",
          value: "HDFS",
        },
        {
          label: "Hive2",
          value: "Hive2",
        },
        {
          label: "ORACLE",
          value: "ORACLE",
        },
      ],
      option2: [
        {
          label: "UTF-8",
          value: "UTF-8",
        },
        {
          label: "GB2312",
          value: "GB2312",
        },
        {
          label: "ISO-8859-1",
          value: "ISO-8859-1",
        },
        {
          label: "GBK",
          value: "GBK",
        },
      ],
      option3: [
        {
          label: "开源KERBORSE",
          value: "开源KERBORSE",
        },
        {
          label: "华为KERBORSE",
          value: "华为KERBORSE",
        },
      ],
      defaultProps: {
        children: "children",
        label: "label",
      },
      inputVal: "",
      select: "",
      tableData: [],
      dataList: [
        {
          user: "admin",
          type: "表",
          mainFont: "XZX_AUDIT_E",
          ml: "数据库",
          status: "是",
        },
      ],
      // 日志明细表格数据
      logList: [
        {
          bm: "ABCD",
          name: "ABCD",
          type: "表",
          objStatus: "新增",
        },
      ],
    };
  },
  methods: {
    // 树形节点点击事件
    handleNodeClick(data) {
      console.log(data);
      if (data.id == 7) {
        this.tableData = [
          {
            bmNum: "Dong_test",
            name: "Dong_test",
            type: "数据库资源",
            datatype: "ORACLE",
            createTime: "2022-01-12",
            changeTime: "2022-01-12",
            zijValue: "UTF-8",
            ml: "Dong_test/Kafaka资源",
            aqType: "开源KERBORSE",
            maxConcatNum: "2",
          },
          {
            bmNum: "test",
            name: "test",
            type: "数据库资源",
            datatype: "ORACLE",
            createTime: "2022-01-12",
            changeTime: "2022-01-12",
            zijValue: "UTF-8",
            ml: "Dong_test/数据库资源",
            aqType: "华为KERBORSE",
            maxConcatNum: "5",
          },
        ];
      }
      if (data.id == 8) {
        this.tableData = [
          {
            bmNum: "Dong_test",
            name: "Dong_test",
            type: "数据库资源",
            datatype: "ORACLE",
            createTime: "2022-01-12",
            changeTime: "2022-01-12",
            zijValue: "UTF-8",
            ml: "Dong_test/Kafaka资源",
            aqType: "开源KERBORSE",
            maxConcatNum: "2",
          },
        ];
      }
      if (data.id == 9) {
        this.tableData = [
          {
            bmNum: "test",
            name: "test",
            type: "数据库资源",
            datatype: "ORACLE",
            createTime: "2022-01-12",
            changeTime: "2022-01-12",
            zijValue: "UTF-8",
            ml: "Dong_test/数据库资源",
            aqType: "华为KERBORSE",
            maxConcatNum: "5",
          },
        ];
      } else {
        ths.tableData = [];
      }
    },
    // 修改表头背景颜色
    changeBgcolor() {
      return "background:#eef1f6;";
    },
    // 表格编辑、查看、删除功能点击事件
    handleEdit(index, row, num) {
      console.log(index, row, num);
      this.newTitle = row.type;
      if (num == 0) {
        // 编辑
        this.flag = false;
        this.isSm = false;
        this.formInfo.bmNum = row.bmNum;
        this.formInfo.name = row.name;
        this.formInfo.value1 = row.datatype;
        this.formInfo.value = row.ml;
        this.formInfo.value2 = row.zijValue;
        this.formInfo.value3 = row.aqType;
        this.formInfo.maxConcatNum = row.maxConcatNum;
      }
      if (num == 1) {
        // 查看
        this.flag = false;
        this.isSm = false;
        this.formInfo.bmNum = row.bmNum;
        this.formInfo.name = row.name;
        this.formInfo.value1 = row.datatype;
        this.formInfo.value = row.ml;
        this.formInfo.value2 = row.zijValue;
        this.formInfo.value3 = row.aqType;
        this.formInfo.maxConcatNum = row.maxConcatNum;
        this.isChose = true;
      }
      if (num == 2) {
        // 资源扫描
        this.flag = false;
        this.isSm = true;
      }
      if (num == 3) {
        // 删除
        this.$message({
          message: "删除成功！",
          type: "success",
        });
      }
    },
    // 点击新建，下拉选择事件
    handleCommand(command) {
      console.log(command);
      this.flag = false;
      // 数据库资源
      if (command == "a") {
        this.newTitle = "数据库资源";
      }
      if (command == "b") {
        this.newTitle = "FTP资源";
      }
      if (command == "c") {
        this.newTitle = "代理资源";
      }
      if (command == "d") {
        this.newTitle = "服务器资源";
      }
      if (command == "e") {
        this.newTitle = "kafka资源";
      }
    },
    // 数据库类型选择事件
    handleChange1(value) {
      console.log(value);
      this.formInfo.value1 = value;
    },
    // 字符集选择事件
    handleChange2(value) {
      console.log(value);
      this.formInfo.value2 = value;
    },
    // 测试连接
    cslj() {
      this.$notify({
        title: "提示",
        message: "测试连接成功",
        type: "success",
        offset: 100,
      });
    },
    // 提交
    submit() {
      this.$message({
        message: "提交成功！",
        type: "success",
      });
      this.flag = true;
    },
    // 取消
    cancel() {
      this.flag = true;
    },
    // 资源扫描删除
    Fndelete(index, row) {
      console.log(index, row);
      this.$message({
        message: "删除成功！",
        type: "success",
      });
    },
    // 点击扫描
    saomiao() {
      this.$confirm("当前扫描任务成功，是否查看日志?", "扫描启动成功", {
        confirmButtonText: "是",
        cancelButtonText: "否",
        type: "warning",
      })
        .then(() => {
          this.activeName = "log";
        })
        .catch(() => {
          this.activeName = "pz";
        });
    },
    // 保存
    baocun() {
      this.$notify({
        title: "提示",
        message: "保存成功",
        type: "success",
        offset: 300,
      });
    },
    // 取消
    quxiao() {
      this.flag = true;
    },
    // 点击查看日志
    look() {
      this.dialogVisible = true;
    },
    // 点击下载日志
    download() {
      this.loading = true;
      setTimeout(() => {
        this.loading = false;
        this.$message({
          message: "日志下载完成",
          type: "success",
        });
      }, 1000);
    },
  },
};
</script>

<style lang="less" scoped>
::v-deep .el-dropdown-menu {
  padding: 20px !important;
}
.zyzc {
  width: 100%;
  height: 100%;
  padding: 0px 10px;
  box-sizing: border-box;
  .z_left {
    width: 100%;
    .l_bottom {
      width: 100%;
      height: 950px;
      border: 1px solid rgb(218, 216, 216);
      border-bottom: none;
      border-top: none;
      padding: 10px;
      box-sizing: border-box;
    }
  }
  .z_right {
    padding: 10px 20px;
    ::v-deep .el-select .el-input {
      width: 130px;
    }
    ::v-deep .input-with-select .el-input-group__prepend {
      background-color: #fff;
    }
    .input {
      width: 40%;
      float: left;
    }
    .btn {
      float: right;
    }
    .table {
      padding: 20px 10px;
      margin-top: 40px;
    }
  }
  .addPage {
    padding: 0 10px;
    .peizhi {
      padding: 0 20px;
      height: 50%;
      .title {
        line-height: 60px;
        border-bottom: 1px solid #eee;
      }
      .con {
        // padding-left: 150px;
      }
    }
    .info {
      cursor: pointer;
      font-weight: 900;
      margin: 10px;
    }
    .nTitle {
      font-weight: 900;
      span {
        display: inline-block;
        font-size: 30px;
        font-weight: 900;
        margin-right: 10px;
        color: royalblue;
      }
    }
    .whriteFrom {
      padding: 10px;
      box-sizing: border-box;
      p {
        margin: 10px;
        font-size: 20px;
      }
      .baseInfo {
        padding-left: 100px;
      }
      .concatInfo {
        padding-left: 100px;
      }
    }
    .btnInfo {
      width: 300px;
      height: 40px;
      margin-left: 70%;
      margin-top: 40px;
    }
  }
}
</style>